<template>
	<view>
		<!-- 顶部背景图片 -->
		<view class="index-bg">
			<view class="location dflex alc pl30 pr30 mt20">
				<image src="../images/location.png" mode=""></image>
				<view class="ml10">郑州市区域代理</view>
			</view>
			<!-- 搜索框 -->
			<view class="ipt auto mt20">
				<u-search shape="round" placeholder="搜索业务员" :showAction="false"></u-search>
			</view>

			<!-- 销量 -->
			<view class="dflex jcse mt40">
				<view class="dflex flexc flex1 alc">
					<view class="fs40 fw900 color">980</view>
					<view class="fs24 fw500 color mt10">总杯数(杯)</view>
				</view>
				<view class="dflex flexc flex1 alc">
					<view class="fs40 fw900 color">1980</view>
					<view class="fs24 fw500 color mt10">总金额(元)</view>
				</view>
			</view>
		</view>
		<view class="center pt30 pl30">
			<view class="pb30"><subtitle title="业务员列表"></subtitle></view>
			<view v-for="(item, index) in indexList" :key="index" class="mb20 salae">
				<SalesMan :item="item" @goSalesDetails="goSalesDetails"></SalesMan>
			</view>
		</view>
		<tabbar :select="0"></tabbar>
	</view>
</template>

<script>
import tabbar from '@/components/tabbar/tabbar.vue';
import SalesMan from '../components/SalesMan/SalesMan.vue';
export default {
	components: { tabbar, SalesMan },
	data() {
		return {
			indexType: uni.getStorageSync('indexType'),
			indexList: [
				{
					id: 1,
					name: '孙子涵',
					phone: 13325728112,
					price: 48291
				},
				{
					id: 2,
					name: '徐松华',
					phone: 15566669999,
					price: 69123
				},
				{
					id: 3,
					name: '许嵩',
					phone: 16688889999,
					price: 12345
				},
				{
					id: 4,
					name: '汪苏泷',
					phone: 19966223311,
					price: 45612
				},
				{
					id: 5,
					name: 'Happy',
					phone: 19999991111,
					price: 98765
				}
			]
		};
	},
	methods: {
		//跳转到业务员详情页面
		goSalesDetails(id) {
			uni.navigateTo({
				url:'/pagesB/salesdetails/salesdetails?id='+id
			})
		}
	},
	onLoad() {
		uni.setStorageSync('indexType', 3);
	}
};
</script>

<style lang="scss" scoped>
.index-bg {
	width: 750rpx;
	height: 600rpx;
	padding: 0.1rpx;
	background-image: url('../images/indexbg.png');
	background-repeat: no-repeat;
	background-size: 100% 100%;
	.location {
		image {
			width: 30rpx;
			height: 30rpx;
		}
	}
	.ipt {
		width: 690rpx;
	}
}
.center {
	width: 750rpx;
	background: #ffffff;
	border-radius: 20rpx 20rpx 20rpx 20rpx;
	opacity: 1;
	margin-top: -280rpx;
	.salae:last-child {
		padding-bottom: 150rpx;
	}
}
</style>
